
<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="__PUBLIC__/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="__PUBLIC__/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="__PUBLIC__/css/animate.min.css" rel="stylesheet">
    <link href="__PUBLIC__/js/plugins/fancybox/jquery.fancybox.css" rel="stylesheet">
    <link href="__PUBLIC__/css/style.min.css?v=4.1.0" rel="stylesheet">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content" id="detail">
    <div class="row animated fadeInRight">
        <div class="col-sm-12"><!--这里是信息页-->
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>详细信息</h5>
                </div>
                <div class="ibox-content profile-content col-sm-12">
                    <div class="col-sm-6">
                        <p><i class="fa fa-time"></i> 活动名称:<strong>{$ActivityData.name}</strong></p><br />
                        <p><i class="fa fa-name"></i> 活动描述:<strong>{$ActivityData.comment}</strong></p><br />
                        <p><i class="fa fa-species"></i> 参与人数:<strong>{$ActivityData.participant_num}</strong></p><br />

                        <p><i class="fa fa-species"></i> 创建时间:<strong>{$ActivityData.time}</strong></p><br />

                        <p><i class="fa fa-species"></i> 创建人:<strong>{$ActivityData.username}</strong></p><br />
                        <p><i class="fa fa-age"></i> 当前状态:<strong>{$ActivityData.step}</strong></p><br />

                        <p><i class="fa fa-species"></i> 开办学院:<strong>{$ActivityData.college_name}</strong></p><br />
                        <p><i class="fa fa-species"></i> 面向对象:<strong>{$ActivityData.toAll=='0'?'本院学生':'全校学生'}</strong></p><br />

                    </div>
                    <div class="user-button col-sm-6">
                        <div class="row">

                            <div id="hidden">
                                {if $type=='1'}
                                    {if !$isRegistered}
                                    <button type="button" v-on:click="register" class="btn btn-default btn-sm btn-block">报名</button>
                                    {else/}
                                    <button type="button" class="btn btn-default btn-sm btn-block" disabled>已报名</button>
                                    {/if}
                                {/if}
                            </div>

                            <!---已报名的才能提交志愿时长-->
                            {if $type=='2' and $isRegistered}
                            <!---TODO 提交志愿时长页面--->
                            <form class="form-horizontal" id="form1">
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-4 control-label">是否属于补录时长：</label>
                                    <div class="col-sm-8 radio">
                                        <label>
                                            <input type="radio" name="是否合作" v-model="append" value="1">是
                                        </label>
                                        <label>
                                            <input type="radio" name="是否合作" v-model="append" value="0" checked>否
                                        </label>
                                    </div>
                                </div>

                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-4 control-label">志愿时长：</label>
                                    <div class="col-sm-8">
                                        <input type="number" step="0.01" v-model="time" name="志愿时长" value="0.00" class="form-control">
                                    </div>
                                </div>

                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <div class="col-sm-4 col-sm-offset-2">
                                        <button class="btn btn-primary" type="button" v-on:click="submit" id="submitButton">提交</button>
                                    </div>
                                </div>
                            </form>
                            {/if}
                        </div>
                    </div><!--这里面是详细信息页-->
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 全局js -->
<script src="__PUBLIC__/js/jquery.min.js?v=2.1.4"></script>
<script src="__PUBLIC__/js/bootstrap.min.js?v=3.3.6"></script>
<script src="__PUBLIC__/js/layui/layui.all.js"></script>
<script src="__PUBLIC__/js/plugins/fancybox/jquery.fancybox.js"></script>
<script src="__PUBLIC__/js/vue.js"></script>
<script src="__PUBLIC__/js/vue-resource.js"></script>
<script>

    function getQueryVariable(variable) //获取get参数
    {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i=0;i<vars.length;i++) {
            var pair = vars[i].split("=");
            if(pair[0] == variable){return pair[1];}
        }
        return(false);
    }

    let form=new Vue({
        el:"#form1",
        data:{
            time:0.00,
            append:0,
        },
        methods:{
            submit:function (){
                let data={
                    time:this.time,
                    append: this.append
                }


                this.$http.post('ConfirmTime.html?ActivityId='+getQueryVariable('Id'),{
                    time:this.time,
                    append: this.append
                }).then(
                    (data)=>
                    {
                        if(data.body.result==='success')
                        {
                            layer.msg('提交成功');
                            setTimeout(function () {
                                window.location.reload();
                            },1000);

                        }
                        else
                        {
                            layer.msg('操作失败');
                        }
                    }
                )
            }
        }
    })

    let detail=new Vue({
        el:"#hidden",
        data:{
            Id:getQueryVariable("Id")
        },
        methods:{
            register:function (){
                this.$http.post('RegisterJson.html',{ActivityId:this.Id}).then(
                    (data)=>
                    {
                        if(data.body.result==='success')
                        {
                            layer.msg('报名成功');
                            setTimeout(function () {
                                window.location.reload();
                            },1000);

                        }
                        else
                        {
                            layer.msg('操作失败');
                        }
                    }
                )
            }
        }
    });

    $('.fancybox').fancybox({
        openEffect: 'none',
        closeEffect: 'none'
    });
</script>
</body>

</html>
